<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" layout:decorator="layout/base">
<head>
	<title>用户管理</title>
	<script type="text/javascript" th:src="@{/assets/js/plugins/pickers/daterangepicker.js}"></script>
</head>

<body>

	<!-- Page header -->
	<div class="page-header" layout:fragment="page-header">
		<div class="page-header-content">
			<div class="page-title">
				<h4><i class="icon-arrow-left52 position-left"></i> <span class="text-semibold">幸福母乳会客户管理系统</span> - 电话预约</h4>
			</div>
		</div>
	</div>
	<!-- /page header -->


	<!-- Main content -->
	<div class="content-wrapper" layout:fragment="content">
	<div class="navbar navbar-inverse" style="margin: 1px 1px 5px 1px;">
			<!-- Left nav -->
			<ul class="nav navbar-nav">
				<li class="active"><a href="###">客户信息</a></li>
				<li><a th:href="@{'/telreserve/'+${customer.id}}">电话邀约</a></li>
				<li><a th:href="@{'/storereserve/'+${customer.id}}">到店邀约</a></li>
				<li><a href="#">到店记录</a></li>
				<li><a th:href="@{'/deal/'+${customer.id}}">成交记录</a></li>
			</ul>
			<!-- /left nav -->
		
			<!-- Right nav -->
			<ul class="nav navbar-nav navbar-right">
				<li><a href="#">Link</a></li>
			</ul>
			<!-- /right nav -->
		
		</div>
		<!-- Table -->
		<div class="panel panel-flat min-panel">
			<div class="panel-heading">
				<h5 class="panel-title"><i class="icon-users text-danger" /> 客户信息</h5>
        	</div>

        	<div class="panel-body form-horizontal">
        	<fieldset id="basic_fieldset">
	        	<legend class="text-semibold text-primary"><i data-toggle="modal" data-target="#basic_dialog" class="icon-hammer pull-right position-left"></i> 基本信息</legend>
				<div class="form-group">
					<label class="col-lg-2 control-label">姓名:</label>
					<div class="col-lg-10">
						<div class="form-control-static" id="name" th:text="${customer.name}">Eugene Kopyov</div>
					</div>
				</div>

				<div class="form-group">
					<label class="col-lg-2 control-label">手机:</label>
					<div class="col-lg-10">
						<div class="form-control-static" id="phone" th:text="${customer.phone}">Eugene Kopyov</div>
					</div>
				</div>
				
				<div class="form-group">
					<label class="col-lg-2 control-label">微信:</label>
					<div class="col-lg-10">
						<div class="form-control-static" id="weixin" th:text="${customer.weixin}">Eugene Kopyov</div>
					</div>
				</div>
				
				<div class="form-group">
					<label class="col-lg-2 control-label">所属门店:</label>
					<div class="col-lg-10">
						<div class="form-control-static" id="store" th:text="${customer.store}">Eugene Kopyov</div>
					</div>
				</div>
				
				<div class="form-group">
					<label class="col-lg-2 control-label">联系地址:</label>
					<div class="col-lg-10">
						<div class="form-control-static" id="address" th:text="${customer.address}">Eugene Kopyov</div>
					</div>
				</div>
				
				<div class="form-group">
					<label class="col-lg-2 control-label">资料来源:</label>
					<div class="col-lg-10">
						<div class="form-control-static" id="source" th:text="${customer.source}">Eugene Kopyov</div>
					</div>
				</div>
				
				<div class="form-group">
					<label class="col-lg-2 control-label">备注:</label>
					<div class="col-lg-10">
						<div class="form-control-static"><p id="comment" th:text="${customer.comment}"></p></div>
					</div>
				</div>
			</fieldset>
			<fieldset id="child_fieldset">
	        	<legend class="text-semibold text-primary"><i data-toggle="modal" data-target="#child_dialog" class="icon-hammer pull-right position-left"></i> 孩子信息</legend>
			    <div class="form-group">
					<label class="col-lg-2 control-label">孩子生日:</label>
					<div class="col-lg-10">
						<div class="form-control-static" id="birthday" th:text="${#calendars.format(customer.birthday,'yyyy-MM-dd')}"></div>
					</div>
				</div>
				
				<div class="form-group">
					<label class="col-lg-2 control-label">孩子性别:</label>
					<div class="col-lg-10">
						<div class="form-control-static" id="sex" th:text="${customer.sex}"></div>
					</div>
				</div>
				
				<div class="form-group">
					<label class="col-lg-2 control-label">孩子出生医院:</label>
					<div class="col-lg-10">
						<div class="form-control-static" id="hospital" th:text="${customer.hospital}"></div>
					</div>
				</div>
			</fieldset>
			<fieldset id="ext_fieldset">
	        	<legend class="text-semibold text-primary"><i data-toggle="modal" data-target="#ext_dialog" class="icon-hammer pull-right position-left"></i> 额外信息</legend>
			    <div class="form-group">
					<label class="col-lg-2 control-label">消费能力:</label>
					<div class="col-lg-10">
						<div class="form-control-static" id="consumption" th:text="${customer.consumption}"></div>
					</div>
				</div>
				
				<div class="form-group">
					<label class="col-lg-2 control-label">健康自查分数:</label>
					<div class="col-lg-10">
						<div class="form-control-static" id="healthScore" th:text="${customer.healthScore}"></div>
					</div>
				</div>
			</fieldset>
			</div>
			<div id="basic_dialog" class="modal fade in">
				<div class="modal-dialog">
					<div class="modal-content">
						<div class="modal-header">
							<button type="button" class="close" data-dismiss="modal">×</button>
							<h5 class="modal-title text-primary">修改基本信息</h5>
						</div>

						<form action="#" id="basicForm">
							<input type="hidden" name="id" th:value="${customer.id}"/>
							<div class="modal-body form-horizontal">
								<div class="form-group">
									<label class="col-lg-2 control-label"><span class="text-danger">*</span>姓名:</label>
									<div class="col-lg-10">
										<input name="name" th:value="${customer.name}" type="text" placeholder="姓名最多10个字符" class="form-control" required="true" maxlength="10"/>
									</div>
								</div>

								<div class="form-group">
									<label class="col-lg-2 control-label"><span class="text-danger">*</span>手机号:</label>
									<div class="col-lg-10">
										<input type="text" th:value="${customer.phone}" class="form-control"  name="phone" placeholder="手机号 最多11位数字" required="true" number="true" maxlength="11"/>
									</div>
								</div>
								
								<div class="form-group">
									<label class="col-lg-2 control-label">微信号</label>
									<div class="col-lg-10">
										<input name="weixin" th:value="${customer.weixin}" type="text" placeholder="微信号 最多20字符字" class="form-control" maxlength="20"/>
									</div>
								</div>

								<div class="form-group">
									<label class="col-lg-2 control-label"><span class="text-danger">*</span>联系地址</label>
									<div class="col-lg-10">
										<input name="address" th:value="${customer.address}" type="text" placeholder="联系地址 最多50个字符" class="form-control" required="true" maxlength="50"/>
									</div>
								</div>
								
								<div class="form-group">
									<label class="col-lg-2 control-label">所属分店</label>
									<div class="col-lg-10">
										<select name="store" class="select form-control input-xs">
											<option th:selected="${customer.store} == ${store.name}" th:each="store : ${stores}" th:value="${store.name}" th:text="${store.name}">总部</option>
										</select>
									</div>
								</div>
								
								<div class="form-group">
									<label class="col-lg-2 control-label">资料来源</label>
									<div class="col-lg-10">
										<select name="source" th:value="${customer.source}" class="select form-control input-xs">
											<option value="1" th:selected="${customer.source == '1'}">医院</option>												
											<option value="0" th:selected="${customer.source == '0'}">自营</option>
											<option value="2" th:selected="${customer.source == '2'}">其他</option>
										</select>
									</div>
								</div>
								
								<div class="form-group">
									<label class="col-lg-2 control-label">备注</label>
									<div class="col-lg-10">
										<textarea cols="5" rows="5" name="comment" placeholder="备注 最多300字符" class="form-control" maxlength="300" th:text="${customer.comment}"></textarea>
									</div>
								</div>
								
							</div>
								
							<div class="modal-footer">
								<button type="button" class="btn btn-link" data-dismiss="modal">关闭</button>
								<button type="button" id="submitBasic" class="btn btn-primary" >保存</button>
							</div>
						</form>
					</div>
				</div>
			</div>
			<div id="child_dialog" class="modal fade in">
				<div class="modal-dialog modal-sm">
					<div class="modal-content">
						<div class="modal-header">
							<input type="hidden" id="path" th:value="@{/assets/js/plugins/raty/images}" />
							<button type="button" class="close" data-dismiss="modal">×</button>
							<h5 class="modal-title text-primary">修改孩子信息</h5>
						</div>
						<div class="modal-body">
						<form action="#" id="childForm">
							<input type="hidden" name="id" th:value="${customer.id}"/>	
							<div class="form-group">
								<label>孩子出生医院</label>	
								<input name="hospital" th:value="${customer.hospital}" type="text" placeholder="孩子出生医院 最多50个字符" class="form-control" maxlength="50"/>
							</div>
							
							<div class="form-group">
								<label>孩子生日</label>	
								<input name="birthday" th:value="${#calendars.format(customer.birthday,'yyyyMMdd')}" id="birthday" type="text" placeholder="" class="form-control" />
							</div>
							
							<div class="form-group">
								<label>孩子性别</label>	
								<select name="sex" th:value="${customer.sex}" class="select form-control input-xs">
									<option value="1">男</option>												
									<option value="0">女</option>
								</select>
							</div>
							<div class="modal-footer">
								<button type="button" class="btn btn-link" data-dismiss="modal">关闭</button>
								<button type="button" id="submitChild" class="btn btn-primary" >保存</button>
							</div>
						</form>
						</div>
					</div>
				</div>
			</div>
			<div id="ext_dialog" class="modal fade in">
				<div class="modal-dialog modal-sm">
					<div class="modal-content">
						<div class="modal-header">
							<input type="hidden" id="path" th:value="@{/assets/js/plugins/raty/images}" />
							<button type="button" class="close" data-dismiss="modal">×</button>
							<h5 class="modal-title text-primary">额外信息</h5>
						</div>
						<div class="modal-body">
						<form action="#" id="extForm">
							<input type="hidden" name="id" th:value="${customer.id}"/>
							<div class="form-group">
								<label>健康分数自查</label>	
								<input name="healthScore" th:value="${customer.healthScore}" type="text" placeholder="数字" class="form-control" maxlength="5" digits="digits"/>
							</div>
							
							<div class="form-group">
								<label>消费能力</label>	
								<select name="consumption" th:value="${customer.consumption}" class="select form-control input-xs">
									<option value="1">1000以下</option>												
									<option value="2">1000以上</option>
								</select>
							</div>
							<div class="modal-footer">
								<button type="button" class="btn btn-link" data-dismiss="modal">关闭</button>
								<button type="button" id="submitExt" class="btn btn-primary" >保存</button>
							</div>
						</form>	
						</div>
					</div>
				</div>
			</div>
		</div>
		<!-- /table -->
		<script type="text/javascript" th:src="@{/oss/js/customerdetail.js}"></script>

	</div>
	<!-- /main content -->

</body>
</html>
